<template>
	<view class="content" >
		<view class="wrap" :style="{minHeight: contentMinHeight}">
			<u-form :model="form" ref="uForm" :error-type="errorType">
				<u-form-item label="提醒时间 :" label-width="200rpx" :leftIconStyle="{color: '#888', fontSize: '40rpx'}" left-icon="clock" prop="rtime">
					<u-input v-model="rtimeTxt" type="string" disabled @click="chooseTime"/>
					<u-picker v-model="showTimePicker" mode="time" :params="timeParams" @confirm="confirmTime"></u-picker>
					<u-input v-model="form.rtime" type="string" />
				</u-form-item>
				
				<u-form-item label-width="0" prop="content">
					<u-input :height="textareaMinHeight" type="textarea" v-model="form.content" class="u-p-x-50" placeholder="请输入日程"/>
				</u-form-item>
				
				<view class="bottom">
					<u-button @click="formSubmit" type="success">保存</u-button>
				</view>
			</u-form>
			<u-modal v-model="showModal" :title="titleModal" :content="contentModal"></u-modal>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>

<script>
/**
 * 页面流程：
 * 1. 通过onLoad: (option){}判断是新增操作还是修改操作，新增执行2，修改执行3
 * 2. 
 * 	2.1 获取当前时间的30分钟后的时间，将时间数据格式化后填入rtimeTxt、form.rtime；
 *  2.2 设置wrap的最小高度
 *  2.3 用户选择时间后，将时间数据格式化后填入rtimeTxt、form.rtime；
 *  2.4 用户点击保存，获取jwt，打包rtime，content，jwt，向服务器发送请求，成功返回后显示信息并返回列表页，失败后显示信息并停留当前页；
 * 3.
 *  3.1 获取日程信息，填入rtimeTxt、form.rtime、form.content；
 *  3.2 用户选择时间后，将时间数据格式化后填入rtimeTxt、form.rtime；
 *  3.3 用户点击保存，获取jwt，打包rtime，content，jwt，向服务器发送请求，成功返回后显示信息并返回列表页，失败后显示信息并停留当前页；
 * 
 * 
 * 4. 页面显示时，检测登录状态，失败则返回列表页，因为正常不应该进去当前页
 * */
	
// 用全局变量代替import，但在validator中要用this调用而不能用self
//import { regExpObj, customCommonObj } from '@/common/js/common.js';
var submitDayNoteUrl = getApp().globalData.submitDayNoteUrl;
var getDayNoteInfoActionUrl = getApp().globalData.getDayNoteInfoActionUrl;
var tmplId = getApp().globalData.tmplId;

export default {
	created() {
		self = this;
	},
	onLoad: (option) => {
		// 获取链接参数
		self.act = ( option.act != undefined ? option.act : 'add' );
		self.did = ( option.did != undefined ? option.did : 0 );
		if(self.act == 'add'){
			// 新增页初始化数据
			var curTime = self.$customCommon.customCommonObj.getCurTime({'min': 30});
			self.rtimeTxt = curTime.dateCnTxt;
			self.form.rtime = curTime.dateEnTxt;			
		}
		if(self.act == 'update' && self.did != 0){
			// 获取数据
			self.getDaynoteInfo();
		}
		
		// 设置wrap最小高度
		var widownPxData = self.$customCommon.customCommonObj.getWindowWidthHeightPx();
		self.contentMinHeight = (widownPxData.height_rpx - 140 + 'rpx');
		self.textareaMinHeight = widownPxData.height_rpx - 430;
	},
	// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
	onReady() {
		this.$refs.uForm.setRules(this.rules);
	},
	onShow: () => {
		// 页面显示时，检测登录状态，失败则返回列表页
		if(!self.checkhasLoginAction()){
			console.log('redirectTo Index');
			uni.redirectTo({
			    url: '/pages/index/index'
			});
		}
	},
	data() {
		return {
			// 模态框
			showModal: false,
			titleModal: '温馨提示',
			contentModal: '由于微信订阅消息的规则限制，必须同意订阅才能收到提醒消息，您可勾选订阅弹窗最下方的“总是保持以上选择，不再询问”选项避免每次都弹窗。',
			// 内容组件高度
			contentMinHeight: '600rpx',
			textareaMinHeight: 600,
			// 表单参数
			act: 'add',
			did: 0,
			errorType: ['toast'],
			showTimePicker: false,
			rtimeTxt: '',
			timeParams: {
				year: true,
				month: true,
				day: true,
				hour: true,
				minute: true,
				second: false,
				timestamp: true,
			},
			form: {
				rtime: '',
				content: '',
			},
			// 表单校验
			rules: {
				rtime: [
					{
						required: true, 
						trigger: 'blur',
						message: '请选择提醒时间'
					},
					{
						// 此处不能用self，不懂
						pattern: this.$customCommon.regExpObj.customRegExp.dateTime,
						message: '时间格式不正确啊亲'
					},
					{
						validator: (rule, value) => {
							// 此处不能用self，不懂
							var ct = this.$customCommon.customCommonObj.getCurTime();
							return value > ct.dateEnTxt;
						},
						message: '请选择未来时间',
					}
				],
				content: [
					{
						required: true,
						min: 1,
						trigger: 'blur',
						message: '请填写日程'
					}
				]
			}
		};
	},
	methods: {
		// picker组件点击触发显示
		chooseTime: () => {
			self.showTimePicker = true;
		},
		// 提醒时间确认按钮
		confirmTime: (e) => {
			var chooseTimeTxt = '', chooseTime = '';
			self.form.rtime = chooseTimeTxt;
			if (self.timeParams.year) chooseTimeTxt += e.year + '年 ';
			if (self.timeParams.month) chooseTimeTxt += e.month + '月 ';
			if (self.timeParams.day) chooseTimeTxt += e.day + '日 ';
			if (self.timeParams.hour) chooseTimeTxt += e.hour + '时 ';
			if (self.timeParams.minute) chooseTimeTxt += e.minute + '分';
			self.rtimeTxt = chooseTimeTxt;
			
			if (self.timeParams.year) chooseTime += e.year + '-';
			if (self.timeParams.month) chooseTime += e.month + '-';
			if (self.timeParams.day) chooseTime += e.day + ' ';
			if (self.timeParams.hour) chooseTime += e.hour + ':';
			if (self.timeParams.minute) chooseTime += e.minute + ':00';
			self.form.rtime = chooseTime;
		},
		// 获取日程数据
		getDaynoteInfo: () => {
			console.log('get Daynote Info');
			uni.request({
				url: getDayNoteInfoActionUrl,
				data: {
					did: self.did,
					jwt: uni.getStorageSync('userJWT')
				},
				success: (res) => {
					if(res.data.status == 200){
						//console.log(res.data.data);
						self.form.rtime = res.data.data.rtime;
						self.form.content = res.data.data.content;
						self.rtimeTxt = res.data.data.rtimeTxt;
					}else{
						setTimeout(function () {
							uni.hideLoading();
							self.$refs.uToast.show({
								title: res.data.txt
								//back: true
								//type: 'error',
							})
						}, 1000);
					}
				},
				fail: (res) => {
					uni.hideLoading();
					var msg = this.serverDie(res.errMsg);
					self.$refs.uToast.show({
						title: msg
						//type: 'error',
					})
				}
			})
		},
		// 表单提交
		formSubmit() {
			// 提示消息订阅
			uni.requestSubscribeMessage({
				tmplIds: [tmplId],
				fail: (resModal) => {
					// 弹出模态框
					self.$refs.uToast.show({
						title: resModal.errMsg,
						type: 'error',
					})
				},
				success: (resModal) =>{
					console.log('Subscribe Message');
					if(resModal[tmplId] == 'reject'){
						// 拒绝订阅消息
						self.showModal = true;
						return false;
					}else{
						// 允许订阅消息
						if(!self.checkhasLoginAction()){
							this.$refs.uToast.show({
								title: '尚未登录',
								type: 'error',
							})
							return false;
						}
						// 表单校验
						this.$refs.uForm.validate(valid => {
							if (valid) {
								// 显示loading
								uni.showLoading({
									title: '正在保存……',
									mask: true,
									success: () => {
										// 提交表单
										uni.request({
											url: submitDayNoteUrl,
											method: 'POST',
											data: {
												act: self.act,
												did: self.did,
												info: {
													rtime: self.form.rtime,
													content: self.form.content
												},
												jwt: uni.getStorageSync('userJWT')
											},
											success: (res) => {
												// 向上一页返回重载标识
												if(res.data.status == 200){
													// 将新增数据返回去上一级页面
													var pages = getCurrentPages();
													var prevPage = pages[pages.length - 2]; //上一个页面
													// 存一个重载标识为true
													prevPage.reloadFlag = true;
													//self.act == 'add' ? (prevPage.reloadFlag = false) : (prevPage.reloadFlag = true);
													// var new_data = {
													// 	id: res.data.data.id,
													// 	rtime: self.form.rtime,
													// 	content: self.form.content,
													// }
													//prevPage.new_data = new_data;
													
													// 返回上一页
													setTimeout(function () {
														uni.hideLoading();
														self.$refs.uToast.show({
															title: res.data.txt,
															//type: 'success',
															back: true
														})
													}, 1000);
												}else{
													setTimeout(function () {
														uni.hideLoading();
														self.$refs.uToast.show({
															title: res.data.txt
															//type: 'error',
														})
													}, 1000);
												}
											},
											fail: (res) => {
												uni.hideLoading();
												var msg = this.serverDie(res.errMsg);
												self.$refs.uToast.show({
													title: msg,
													type: 'error',
												})
											}
										})
									}
								});
							}
						});
					}
				}
			})

		}
	}
};
</script>

<style scoped lang="scss">
.content{
	background-color: #f5f5f5;
	padding: 24rpx 24rpx 110rpx 24rpx;
}
.wrap {
	background-color: #FFFFFF;
	padding: 24rpx;
	width: 100%;
	font-size: 30rpx;
}
.bottom{
	width: 100%;
	position: fixed;
	bottom: 0rpx;
	left: 0rpx;
	padding: 10rpx 24rpx;
	z-index: 99;
}
</style>